<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>${goods.gname}</title>
    <!-- layUI的核心CSS文件 -->
    <link rel="stylesheet" type="text/css"
          href="${pageContext.request.contextPath}/static/layui-v2.5.7/layui/css/layui.css"/>
    <!-- layUI的核心JS文件 -->
    <script src="${pageContext.request.contextPath}/static/layui-v2.5.7/layui/layui.js" type="text/javascript"
            charset="UTF-8"></script>
    <style>
        .detail div {
            margin-top: 10px;
        }
    </style>
</head>
<body>

<div class="layui-layout layui-layout-admin">
    <!-- 头部区域（可配合layui已有的水平导航） -->
    <div class="layui-header">
        <div class="layui-logo"><a style="color: #009688;">龙洞闲置购物系统</a></div>
        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item">
                <a href="ShowALLGoods">首页</a>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:">商品详情</a>

            </li>
            <script type="text/javascript">
                layui.use('form', function () {
                    let form = layui.form;
                    form.on('submit(search)', function (data) {
                        console.log(data);
                        return false;
                    });
                });
            </script>
        </ul>
        <%@include file="../common/head.jsp" %>
    </div>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px">
        <legend style="margin-left: 50px;">商品详情</legend>
    </fieldset>
    <%-- 主体部分 --%>
    <div class="detail">
        <div class="layui-row">
            <div class="layui-col-md8 layui-col-lg-offset2"
                 style="margin-top: 50px;border: 1px solid gray;height: 440px;margin-bottom: 20px;">
                <%-- 商品图片、商品名、价格 --%>
                <div class="layui-col-md5"
                     style="margin: 10px;margin-top:20px;height: 400px;text-align: center;">
                    <c:if test="${goods.gimg_path==''}">
                        <img src="${pageContext.request.contextPath}/static/images/white1.jpg"
                             style="max-width: 80%;max-height: 80%;" alt="图片加载失败">
                    </c:if>
                    <c:if test="${goods.gimg_path!=''}">
                        <img src="${goods.gimg_path}"
                             style="max-width: 80%;max-height: 80%;" alt="图片加载失败">
                    </c:if>
                    <div class="layui-row" style="font-size: 25px;">
                        ${goods.gname}<br>
                        <span style="font-size:30px;color: red;">
                                ￥${goods.gprice}
                            </span>
                    </div>
                </div>
                <%-- 商品其他详细信息 --%>
                <div id="detail" class="layui-col-md6" style="margin-top: 20px;width:500px;height: 300px;">
                    <%--						发送隐藏表单--%>
                    <input type="hidden" name="ogname" value="${goods.gname}">
                    <input type="hidden" name="ogdetail" value="${goods.gdetail}">
                        <!-- 商品名 -->
                        <div class="layui-row" style="font-size: 25px;color: black;">
                            <span style="font-size: 18px;color: gray;">商品名： </span>${goods.gname}
                        </div>
                        <!-- 价格 -->
                        <div class="layui-row" style="font-size: 25px;color: red;">
                            <span style="font-size: 18px;color: gray;">价格： </span>¥ ${goods.gprice}
                        </div>
                    <%-- 商品类别 --%>
                    <div class="layui-row" style="font-size: 20px;color: rebeccapurple;">
                        <span style="font-size: 18px;color: gray;">商品类别： </span>${goods.gcid}
                    </div>
                    <%-- 商品描述 --%>
                    <div class="layui-row" style="font-size: 20px;color: dimgrey">
                        <span style="font-size: 18px;color: gray;">商品描述： </span>

                        <c:if test="${goods.gdetail==''}">
                            （无）
                        </c:if>
                        <c:if test="${goods.gdetail!=''}">
                            ${goods.gdetail}
                        </c:if>

                    </div>
                    <%-- 上架时间 --%>
                    <div class="layui-row" style="font-size: 18px;color: rebeccapurple">
                        <span style="font-size: 18px;color: gray;">上架时间： </span>${goods.gtime}
                    </div>
                    <%-- 卖家 --%>
                    <div class="layui-row" style="font-size: 20px;color: darkslategrey">
                        <span style="font-size: 18px;color: gray;">卖家： </span>${goods.guname}
                    </div>

                    <div class="layui-form-item" style="margin-top: 100px;margin-left: 50px">
                        <a href="ensureOrder?gid=${goods.gid}&obid=${user.uid}">
                            <button class="layui-btn">购买</button>
                        </a>
                        <%--如果管理员登录了，则显示下架按钮--%>
                        <c:if test="${not empty sessionScope.admin}">
                            <a href="${pageContext.request.contextPath}/showOSGoodsDetail?gid=${goods.gid}">
                                <button class="layui-btn" lay-submit>下架商品</button>
                            </a>
                        </c:if>
                        <%-- 举报 --%>
                        <a href="${pageContext.request.contextPath}/writeTOGoods?gid=${goods.gid}">
                            <button class="layui-btn" style="margin-left: 20px;">举报</button>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        //JavaScript代码区域
        layui.use('element', function () {
            let element = layui.element;
        });
    </script>
</div>

</body>
</html>
